<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
<title>退换货登记</title>
<meta name="decorator" content="default" />
<script type="text/javascript">
	var subFlag = true;
	$(document).ready(function() {
		
	});

	function page(n, s) {
		$("#pageNo").val(n);
		$("#pageSize").val(s);
		$("#searchForm").submit();
		return false;
	}

	function shows(n) {
		$.ajax({
			url : "${ctx}/sys/ordersexchange/form",
			data : {
				"id" : n
			},
			//async:false,
			dataType : "json",
			type : "post",
			success : function(data) {
				$("#userId").val(data.orders.user.id);
				$("#ordersCode").val(data.orders.code);
				$("#ordersPayType").val(data.orders.payType);
				$("#remarks").val("");
				$("#viewCode").html(data.orders.code);
				if(data.resultCode == "0"){
					alert(data.resultMessage);
					return;
				}
				$("#detailTable").empty();
				$("#detailTable").append("<tr><td>商品名称</td><td>单价</td><td>购买数量</td><td>退换货数量</td><td>退换货金额</td></tr>");
				for(var i=0;i<data.detailCount.length;i++){
					$("#detailTable").append(createRow(i,data.detailCount[i]));
				}
				$("#detailTable").append("<tr><td colspan='5'>退换货总额:<span id='total'></span></td></tr>");
				$("#importBox_goods").show();
			},
			error : function() {
				alert("网络异常");
			}
		})
	}

	function confirm_imbox() {
			if($("#type").val()==""){
				alert("请选择退换货类型");
				return;
			}
			if (subFlag) {
				var num = "";
				var money = "";
				var goodsCnName = "";
				var goodsCode = "";
				for(var i=0;i<$(".num").length;i++){
					if(i>0){
						num+=",";
						money+=",";
						goodsCnName+=",";
						goodsCode+=",";
					}
					num += $("#num_"+i).val();
					money += $("#money_"+i).val();
					goodsCnName += $("#goodsCnName_"+i).val();
					goodsCode += $("#goodsCode_"+i).val();
				}
				$.ajax({
					url : "${ctx}/sys/ordersexchange/save",
					data : {
						"type":$("#type").val(),
						"userId" : $("#userId").val(),
						"ordersCode" : $("#ordersCode").val(),
						"ordersPayType" : $("#ordersPayType").val(),
						"goodsCnName" : goodsCnName,
						"goodsCode" : goodsCode,
						"num" : num,
						"money" : money,
						"remarks" : $("#remarks").val()
					},
					//async:false,
					dataType : "json",
					type : "post",
					success : function(data) {
						if(data.resultCode == "1"){
							$("#importBox_goods").hide();
							showTip("保存成功", "", 3000,0);
						}
					},
					error : function() {
						alert("网络异常");
					}
				});
			} else {
				loading('正在提交，请稍等...');
			}
		
	}

	function close_imbox() {
		$("#importBox_goods").hide();
	}

	function remarksChange(obj) {
		$("#remarksLength").html($(obj).val().length);
	}
	
	function createRow(index,data){
		return "<tr>"+
					"<td><input type='hidden' name='goodsCnName' id='goodsCnName_"+index+"' value='"+data.goodsCnName+"'/><input type='hidden' name='goodsCode' id='goodsCode_"+index+"' value='"+data.goodsCode+"'/>"+data.goodsCnName+"</td><td id='price_"+index+"'>"+data.price+"</td><td>"+data.num+"</td><td><input type='text' id='num_"+index+"' style='width:50px' maxlength='9' class='num' onkeyup='numchange("+index+")' value='0' ></input></td><td><input type='hidden' id='money_"+index+"' name='money' value='0' /><span id='rowTotal_"+index+"' class='rowTotal'>0</span></td>"+
			   "</tr>";
	}
	
	function numchange(index){
		if($("#type").val()=="1"){
			if(!isNaN(parseInt($("#num_"+index).val())) && parseInt($("#num_"+index).val()) >= 0){
				$("#num_"+index).val(parseInt($("#num_"+index).val()));
				$("#money_"+index).val(parseInt($("#num_"+index).val()) * $("#price_"+index).html());
				$("#rowTotal_"+index).html(parseInt($("#num_"+index).val()) * $("#price_"+index).html());
			}else{
				$("#num_"+index).val(0);
				$("#money_"+index).val("0");
				$("#rowTotal_"+index).html("0");
			}
			var total = 0;
			for(var i=0;i<$(".rowTotal").length;i++){
				total += parseInt($("#rowTotal_"+i).html());
				$("#total").html(total);
			}
		}else if($("#type").val()=="2"){
			if(isNaN(parseInt($("#num_"+index).val())) || parseInt($("#num_"+index).val()) <0){
				$("#num_"+index).val(0);
			}
			$("#money_"+index).val("0");
			$($("#rowTotal_"+index)).html(0);
			$("#total").html(0);
		}
	}
	
	function typeChange(){
		if(!$("#type").val()==""){
			for(var i=0;i<$(".num").length;i++){
				numchange(i);
			}
		}
	}
</script>

<style>
#importBox_goods {
	position: fixed;
	padding: 0 15px;
	width: 350px;
	background: #FFF;
	top: 10%;
	left: 25%;
	margin: 0 auto;
	border: 1px solid #CCC;
	box-shadow: 3px 3px 10px 4px #DDD;
	z-index: 9999;
}

#importBox_goods .ib_bottom {
	margin-bottom: 35px;
}
</style>
</head>
<body>
	<ul class="nav nav-tabs">
		<li class="active"><a href="${ctx}/sys/ordersexchange/">退换货登记列表</a></li>
	</ul>
	<form:form id="searchForm" modelAttribute="orders"
		action="${ctx}/sys/ordersexchange/" method="post"
		class="breadcrumb form-search">
		<input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}" />
		<input id="pageSize" name="pageSize" type="hidden"
			value="${page.pageSize}" />
		<ul class="ul-form">

			<li><label>订单编号：</label> <form:input path="code"
					htmlEscape="false" maxlength="50" class="input-medium" /></li>

			<li><label>下单用户类型：</label> <form:select id="userType"
					path="userType" class="input-medium">
					<form:option value="" label="所有" />
					<form:options items="${fns:getDictList('orders_user_type')}"
						htmlEscape="false" itemValue="value" itemLabel="label" />
				</form:select></li>
			<li><label>下单时间：</label> <input name="starPayDate" type="text" 
				readonly="readonly" placeholder="开始时间" class="input-medium Wdate "
				value="<fmt:formatDate value="${order.createDate }" pattern="yyyy-MM-dd HH:mm:ss"/>"
				onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:false});" />
				&nbsp;&nbsp;&nbsp;&nbsp; <input name="endPayDate" type="text"
				readonly="readonly" placeholder="结束时间" class="input-medium Wdate "
				value="<fmt:formatDate  value="${order.createDate }" pattern="yyyy-MM-dd HH:mm:ss"/>"
				onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:false});" />
			</li>
			<li>
			<li><label>下单门店：</label> <form:select id="buyStoreCode"
					path="buyStoreCode" class="input-medium">
					<form:option value="" label="所有" />
					<form:options items="${store}" htmlEscape="false" itemValue="code"
						itemLabel="cnName" />
				</form:select></li>
			<li class="btns"><input id="btnSubmit" class="btn btn-primary"
				type="submit" value="查询" /></li>
			<li class="clearfix"></li>
		</ul>
	</form:form>
	<sys:message content="${message}" />
	<table id="contentTable"
		class="table table-striped table-bordered table-condensed">
		<thead>
			<tr>
				<th>序号</th>
				<th>订单编号</th>
				<th>下单时间</th>
				<th>用户类型</th>
				<th>下单用户</th>
				<th>订单金额</th>
				<th>下单门店</th>
				<shiro:hasPermission name="sys:ordersexchange:edit">
					<th>操作</th>
				</shiro:hasPermission>
			</tr>
		</thead>
		<tbody>
			<c:forEach items="${page.list}" var="orders" varStatus="status">
				<tr>
					<td>${status.index+1}</td>
					<td><a href="${ctx}/sys/orders/form?id=${orders.id}">${orders.code}</a></td>
					<td><fmt:formatDate value="${orders.createDate}"
							pattern="yyyy-MM-dd HH:mm:ss" /></td>
					<td>${fns:getDictLabel(orders.userType, 'user_type', '')}</td>
					<td><c:choose>
							<c:when test="${orders.userType == 1}">
							${orders.userName}	
						</c:when>
							<c:when test="${orders.userType == 2}">
							${orders.userCompany}
						</c:when>
						</c:choose></td>
					<td>
						<c:choose>
							<c:when test="${orders.transportType == 1}">
								<c:choose>
									<c:when test="${orders.freight != null && orders.freight != ''}">
										${orders.money + orders.freight}
									</c:when>
									<c:otherwise>
										${orders.money}
									</c:otherwise>
								</c:choose>
							</c:when>
							<c:otherwise>
								${orders.money}
							</c:otherwise>
						</c:choose>
					</td>
					<td>${orders.buyStoreName}</td>
					<shiro:hasPermission name="sys:ordersexchange:edit">
						<td><a href="javascript:void(0)"
							onclick="shows('${orders.id}')">录入</a></td>
					</shiro:hasPermission>
				</tr>
			</c:forEach>
		</tbody>
	</table>
	<div class="pagination">${page}</div>

	<!-- 弹框 -->
	<div id="importBox_goods" class="hide">
		<form action="${ctx}/sys/ordersexchange/save" method="post" id="forms">
			<input type="hidden" id="ordersCode" name="orderCode" value="" />
			<input type="hidden" id="ordersPayType" name="ordersPayType" value="" />
			<input type="hidden" id="userId" name="userId" value="" />
			<div style="margin-top: 20px;">
				订单编号:<span id="viewCode"></span>
				<br>
				退换货类型:<select name="type" id="type" style="width:100px;" onchange="typeChange()">
							<option value="">请选择</option>
							<c:forEach items="${returnsGoodsType}" var="bean">
								<option value="${bean.value}">${bean.label}</option>
							</c:forEach>
						</select>
				<table id="detailTable" class="table table-striped table-bordered table-condensed">
					
				</table>
				退换货说明:
				<textarea rows="4" cols="30" name="remarks" id="remarks"
					style="resize: vertical;" maxlength="100"
					onkeyup="remarksChange(this)"></textarea>
					<span style="vertical-align: bottom;"><span
					style="vertical-align: bottom;" id="remarksLength">0</span>/100</span>
			</div>
		</form>
		<div class='ib_bottom'>
			<input id="btnCancel" class="btn" type="button" style='' value="确定"
				onclick="confirm_imbox()" /> <input id="btnCancel" class="btn"
				type="button" style='margin-left: 10px;' value="取消"
				onclick="close_imbox()" />
		</div>
	</div>
</body>
</html>